@layout("/common/_container.html"){
<div class="container-fluid" style="padding: 0 !important;">
    <div class="row">
        <div class="col-sm-12">
            @for(notice in noticeList){
            <div class="alert alert-success alert-dismissable">
                <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                ${notice.content}
            </div>
            @}
        </div>
    </div>
    Welcome<br/>
   <!-- <input id="text" type="text"/>
    <button onclick="send()">Send</button>
    <button onclick="closeWebSocket()">Close</button>
    <button onclick="cleanList()">clean</button>
    <div id="message">

    </div>
    <div id="question">

    </div>-->
 <!--   <script type="text/javascript">
        var interval;
        var websocket = null;
        var nowNum = 0;
        var maxNum = 5;
        var maxTime = 20;
        var isSend = false;
        var questionArray;
        //判断当前浏览器是否支持WebSocket
        if ('WebSocket' in window) {
            websocket = new WebSocket("ws://10.10.113.23/front/webSocketServer");
        }
        else {
            alert('Not support websocket')
        }

        //连接发生错误的回调方法
        websocket.onerror = function () {
//            setMessageInnerHTML("error");
            console.log("open");
        };

        //连接成功建立的回调方法
        websocket.onopen = function (event) {
//            setMessageInnerHTML("open");
            console.log("open");
        }

        //接收到消息的回调方法
        websocket.onmessage = function (event) {
            setMessageInnerHTML(JSON.parse(event.data));
        }

        //连接关闭的回调方法
        websocket.onclose = function () {
            console.log("close");
        }

        //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
        window.onbeforeunload = function () {
            websocket.close();
        }

        //将消息显示在网页上
        function setMessageInnerHTML(res) {
            if (res.code = 200) {
                var data = res.data;
                var returnCode = data.returnCode;
                //进入房间的code
                if (returnCode == 1000) {
                    var userStatus = data.userStatus;
                    document.getElementById('message').innerHTML += '房间号为：';
                    document.getElementById('message').innerHTML += data.roomId + '<br/>';
                    if (userStatus == "owner") {
                        document.getElementById('message').innerHTML += '您的身份是： 房主<br/>';
                    } else if (userStatus == "visitor") {
                        document.getElementById('message').innerHTML += '您的身份是： 观看者<br/>';
                    }
                } else if (returnCode == 1001) {
                    console.log(data);
                    var userStatus = data.userStatus;
                    if (userStatus == "guest") {
                        document.getElementById('message').innerHTML += '您的身份是： 对战者<br/>';
                    } else if (userStatus == "owner") {
                        document.getElementById('message').innerHTML += '可以开始比赛！<button id="beginMatch" onclick="matchBegin()">开始</button>';
                    }
                } else if (returnCode == 1002) {
                    questionArray = data.questions;
                    showQuestion();
                } else if (returnCode == 1003) {
                    //展示双方答案
                    var answer = data.answer;
                    var isFinal = data.isFinal;
                    var answerButton = $("#question").find("button[answer=" + answer + "]");
                    answerButton.append("<span style='color: yellow'>:对方已选择</span>");
                    if (isFinal) {
                        showAnswer();
                        clearInterval(interval);
                    }
                } else if (returnCode == 1004) {
                    var isFinal = data.isFinal;
                    var answerButton = $("#question").find("button[answer=" + answer + "]");
                    answerButton.append("<span style='color: yellow'>:对方已选择</span>");
                    if (isFinal) {
                        showAnswer();
                        clearInterval(interval);
                    }
                } else if (returnCode == 5001) {
                    $("#message").html("异常错误，对局结束！");
                } else if (returnCode == 5002) {
                    var info = data.info;
                    var userStatus = data.userStatus;
                    $("#message").html(userStatus + info.realname + "已离开");
                } else if (returnCode == 1005) {
                    console.log(data);
                }
            }
        }
        function matchBegin() {
            var msg = {code: 2001};
            websocket.send(JSON.stringify(msg));
            $("#beginMatch").remove();
        }
        //关闭连接
        function closeWebSocket() {
            websocket.close();
        }

        //发送消息
        function send() {
            var message = document.getElementById('text').value;
            var msg = {roomId: message, openId: "123"};
            websocket.send(JSON.stringify(msg));
        }
        function cleanList() {
            var msg = {clean: true};
            websocket.send(JSON.stringify(msg));
        }
        function showQuestion() {
            if (nowNum >= 5) {
                return;
            }
            isSend = false;
            console.log(questionArray[nowNum]);
            console.log(nowNum);
            var infoText = questionArray[nowNum].infoText;
            var answer1 = questionArray[nowNum].answers[0];
            var answer2 = questionArray[nowNum].answers[1];
            var answer3 = questionArray[nowNum].answers[2];
            var answer4 = questionArray[nowNum].answers[3];
            var questionId = questionArray[nowNum].id;
            var number = nowNum + 1;
            $("#question").empty();
            $("#question").append('<div>第' + number + '题</div>');
            $("#question").append(infoText);
            if (typeof(answer1) != "undefined") {
                $("#question").append('<button answer="0" type="button" onclick="sendAnswer(this,' + questionId + ')">A.' + answer1 + '</button>');
            }
            if (typeof(answer2) != "undefined") {
                $("#question").append('<button answer="1" type="button" onclick="sendAnswer(this,' + questionId + ')">B.' + answer2 + '</button>');
            }
            if (typeof(answer3) != "undefined") {
                $("#question").append('<button answer="2" type="button" onclick="sendAnswer(this,' + questionId + ')">C.' + answer3 + '</button>');
            }
            if (typeof(answer4) != "undefined") {
                $("#question").append('<button answer="3" type="button" onclick="sendAnswer(this,' + questionId + ')">D.' + answer4 + '</button>');
            }
            var time = maxTime;
            $("#question").append('<div>剩余时间:<p id="leftTime">' + time + '</p></div>');
            interval = window.setInterval(function () {
                time&#45;&#45;;
                if (time <= 0) {
                    //展示正确答案
                    isSend = true;
                    showAnswer();
                    clearInterval(interval);
                } else {
                    $("#leftTime").html(time);
                }
            }, 1000)
        }
        function showAnswer() {
            var rightAnswer = questionArray[nowNum].rightAnswer;
            console.log("当前是第" + nowNum + "题");
            var answerButton = $("#question").find("button[answer=" + rightAnswer + "]");
            answerButton.css("color", "green");
            nowNum++;
            if (nowNum < maxNum) {
                //停3秒，然后进入下一题
                setTimeout(showQuestion, 3000)
            } else {
                showResult();
            }
        }
        function showResult() {

        }
        function sendAnswer(button, questionId) {
            if (!isSend) {
                var answer = $(button).attr("answer");
                var answerTime = $("#leftTime").html();
                $(button).append("<span style='color: yellow'>:已选择</span>");
                var msg = {
                    code: 2002,
                    answer: answer,
                    answerTime: answerTime,
                    questionId: questionId,
                    answerNum: nowNum
                };
                websocket.send(JSON.stringify(msg));
                isSend = true;
            }
        }
    </script>-->
</div>
@}
